const zbEditTable = function () {
    "use strict";

    //根据传入的行数,列数创建空的可编辑的表格
    this.createEmptyEditTable = function (id, rowNum, colNum, config={}) {

        let table = document.createElement('table');
        table.setAttribute('id', id);

        if (config['clsssTable'] !== undefined) {
            table.classList.add(config['clsssTable']);
        }

        let tr = document.createElement('tr');
        if (config['clsssTr'] !== undefined) {
            tr.classList.add(config['clsssTr']);
        }

        for (let y=0; y<rowNum; y++) {
            let trCopy = tr.cloneNode();

            trCopy.setAttribute('data-row-idx', y);

            //每一行的其余td
            for (let x=0; x<colNum; x++) {
                trCopy.appendChild(this.createEditCell('', '', config));
            }

            table.appendChild(trCopy);
        }

        return table; //返回DOM元素, target.appendChild(table);
    }

    //根据传入的数据,创建一个可编辑的表格
    this.createValuedEditTable = function (id, arr, config={}) {

        let table = document.createElement('table');
        table.setAttribute('id', id);

        if (config['clsssTable'] !== undefined) {
            table.classList.add(config['clsssTable']);
        }

        let tr = document.createElement('tr');
        if (config['clsssTr'] !== undefined) {
            tr.classList.add(config['clsssTr']);
        }

        for (let y=0; y<arr.length; y++) {
            let trCopy = tr.cloneNode();
            for (let x in arr[y]) {
                trCopy.appendChild(this.createEditCell('', arr[y][x], config));
            }

            table.appendChild(trCopy);
        }

        return table; //返回DOM元素, target.appendChild(table);
    }

    //根据传入的数据,创建一个只读的表格
    this.createValuedReadTable = function (id, arr, config={}) {

        let table = document.createElement('table');
        table.setAttribute('id', id);

        if (config['clsssTable'] !== undefined) {
            table.classList.add(config['clsssTable']);
        }

        let tr = document.createElement('tr');
        if (config['clsssTr'] !== undefined) {
            tr.classList.add(config['clsssTr']);
        }

        for (let y=0; y<arr.length; y++) {
            let trCopy = tr.cloneNode();

            //每一行的其余td
            for (let x in arr[y]) {
                trCopy.appendChild(this.createReadCell(arr[y][x], config));
            }

            table.appendChild(trCopy);
        }

        return table; //返回DOM元素, target.appendChild(table);
    }

    //创建可以动态加减, 可以编辑的表格
    this.createEmptyResponseEditTable = function (id, rowNum, colNum, config={}) {

        let table = document.createElement('table');
        table.setAttribute('id', id);

        if (config['clsssTable'] !== undefined) {
            table.classList.add(config['clsssTable']);
        }

        let tr = document.createElement('tr');
        if (config['clsssTr'] !== undefined) {
            tr.classList.add(config['clsssTr']);
        }

        let tbody = document.createElement('tbody');
        for (let y=0; y<rowNum; y++) {
            let trCopy = tr.cloneNode();

            //每一行的其余td
            for (let x=0; x<colNum; x++) {
                trCopy.appendChild(this.createEditCell('', '', config));
            }

            let td = document.createElement('td');
            let btn = document.createElement('button');
            btn.innerText = '-';
            btn.setAttribute('style','width:20px;height:100%');
            btn.setAttribute('onclick', 'let tr = this.parentNode.parentNode; let tbody = tr.parentNode; tbody.removeChild(tr); console.log(tbody)');
            td.appendChild(btn);
            trCopy.appendChild(td);

            tbody.appendChild(trCopy);
        }
        table.appendChild(tbody);

        let tfoot = document.createElement('tfoot');
        let btn = document.createElement('button');
        btn.innerText = '+';
        btn.setAttribute('style','width:20px;height:20px;padding:0;text-align:center;')
        btn.setAttribute('onclick', 'let tbody=this.parentNode.parentNode.getElementsByTagName("tbody")[0]; let newTr=tbody.lastElementChild.cloneNode(true); tbody.appendChild(newTr)');
        // btn.setAttribute('onclick', 'let tr = this.parentNode.parentNode.getElementsByTagName("tbody").children; console.log(tr)');
        tfoot.appendChild(btn);
        table.appendChild(tfoot);

        return table; //返回DOM元素, target.appendChild(table);
    }

    //创建可以编辑的表格td
    this.createEditCell = function (name, value, config={}) {
        let td = document.createElement('td');
        if (config['classTd'] !== undefined) {
            td.classList.add(config['classTd']);
        }

        let input = document.createElement('input');
        input.setAttribute('type', 'text');
        input.setAttribute('name', name);
        input.setAttribute('value', value);
        if (config['classInput'] !== undefined) {
            input.classList.add(config['classInput']);
        }

        td.appendChild(input);
        return td;
    }

    //创建只读的表格td
    this.createReadCell = function (value, config={}) {
        let td = document.createElement('td');
        if (config['classTd'] !== undefined) {
            td.classList.add(config['classTd']);
        }

        td.innerText = value;
        return td;
    }

    //将字符串数据转为数组
    this.convertStrToArr = function (str, trGap=';', tdGap=',') {
        let arrTr = str.split(trGap); //拆分成多行

        let data = [];
        for (let i=0; i<arrTr.length; i++) {
            let arrTd = arrTr[i].split(tdGap); //拆分成td
            
            data.push(arrTd);
        }

        return data;
    }

    
    this.getInputs = function (id, trGap=';', tdGap=',') {
        let trs = document.getElementById(id).getElementsByTagName('tr');
        let data = [];
        for (let i = 0; i < trs.length; i++) {
            let rowData = [];
            let inputs = trs[i].getElementsByTagName('input');
            for (let j = 0; j < inputs.length; j++) {
                rowData.push(inputs[j].value);
            }
            data.push(rowData.join(tdGap));
        }

        return data.join(trGap);
    }

}